<template>
    <div>
        <table class="table table-bordered">
            <tbody>
                <tr>
                    <td align="right">活动信息</td>
                    <td><input type="text" v-model="Info.ActionName"></td>
                </tr>
                <tr>
                    <td align="right">活动状态</td>
                    <td><input type="radio" name="state" :value="1" v-model="Info.ActionState">启用
                        <input type="radio" name="state" :value="0" v-model="Info.ActionState">禁用
                    </td>
                </tr>
                <tr>
                    <td align="right">活动类型</td>
                    <td><input type="text" v-model="Info.ActionType"></td>
                </tr>
                <tr>
                    <td align="right">活动地点</td>
                    <td><input type="text" v-model="Info.ActionAddr"></td>
                </tr>
                <tr>
                    <td align="right">活动发起人</td>
                    <td><input type="text" v-model="Info.ActionMan"></td>
                </tr>
                <tr>
                    <td align="right">活动图片</td>
                    <td><input type="file" @change="img">
                    <img :src="Info.ActionPhoto" alt="" width="70" height="60" v-if="Info.ActionPhoto!=''">
                    </td>
                </tr>
                <tr>
                    <td></td>
                    <td>
                        <input type="button" value="修改" @click="update" class="btn btn-warning">
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
</template>

<script setup lang="ts">
import { ref,reactive,onMounted } from 'vue';
import axios from 'axios';
import { useRoute,useRouter } from 'vue-router';
import { idText } from 'typescript';

const router=useRouter();
const route=useRoute();

let Info:any=reactive({
    ActionId:route.query.ActionId,
    "ActionName": "",
    "ActionState": 1,
    "ActionType": "",
    "ActionAddr": "",
    "ActionMan": "",
    "ActionPhoto": "",
})
onMounted(()=>{
    getdata();
})
const getdata=()=>{
    axios({
        url:'/api/Action/FindAction',
        method:'get',
        params:{
            ActionId:route.query.ActionId
        }
    })
    .then(res=>{
        console.log(res);
        Object.assign(Info,res.data);
        
    })
    .catch(err=>{
        console.log(err);
        
    })
}
const update=()=>{
    axios({
        url:'/api/Action/UpdateAction',
        method:'put',
        data:Info
    })
    .then(res=>{
        console.log(res);
        if(res.data==-1)
        {
            alert("活动已存在");
            return;
        }
        else if(res.data>0)
        {
            alert("修改成功");
            router.push("/actionlist");
        }
        else{
            alert("修改失败");
            return;
        }
    })
    .catch(err=>{
        console.log(err);
        
    })
}
const img=(e:any)=>{
    let f=e.target.files[0];
    let fs=new FormData();
    fs.append('file',f);
    axios({
        url:'/api/Img/Img',
        method:'post',
        data:fs
    })
    .then(res=>{
        console.log(res);
        if(res.data=="不对")
        {
            alert("图片格式不正确");
            return;
        }
        if(res.data=="大小不对")
        {
            alert("图片不得大于2M");
            return;
        }
        Info.ActionPhoto=res.data;
        
    })
    .catch(err=>{
        console.log(err);
        
    })
}
</script>

<style scoped>

</style>